//视频播放页
require('../css/player.less');
document.ready(function () {

    const BASE_URL = 'http://139.9.177.51:8099' // 接口请求的 URL

    // 判断用户是否登录，若没登陆，跳转到登录页
    window.utils.checkUserLogin();


    // 获取dom节点
    let preBtn = document.querySelector('#preBtn'); //上一节
    let stopBtn = document.querySelector('#stopBtn'); //暂停
    let nextBtn = document.querySelector('#nextBtn'); //下一节

    let cover = document.querySelector('#cover'); //蒙层
    let continueBtn = document.querySelector('#continueBtn'); //继续
    let overBtn = document.querySelector('#overBtn'); //结束
    let video = document.querySelector('#video'); //视频
    let knobble = document.querySelector('#knobble'); //视频小节
    let overall = document.querySelector('#overall'); //视频长度
    let videoTitle = document.querySelector('#videoTitle'); //视频标题
    let curImg = document.querySelector('#curImg'); //视频蒙层图片
    let progress = document.querySelector('#progress'); //视频进度条

    // 获取视频
    let fragments = JSON.parse(localStorage.getItem('fragments'))
    console.log(fragments);
    //视频总长
    overall.textContent = fragments.length;

    let index = 0;
    let ntervalId; //保存定时器
    let spend = []; //花费的时间

    function videoPlay() {
        video.src = `${BASE_URL}${fragments[index].videoUrl}`
        knobble.textContent = `${index+1}`
        videoTitle.textContent = `${fragments[index].title}`
        //监听视频结束  
        window.setTimeout(function () {
            video.play();
        }, 50)
    }
    videoPlay()
    // console.dir(video);

    // 当前宽度/总宽度=播放时间/当前段总时间
    // 当前宽度=播放时间/当前段总时间*总宽度

    // 计算进度条
    function calcProgress() {
        // duration 当前段总时间
        // currentTime 播放时间
        ntervalId = window.setInterval(function () {
            progress.style.width = `${video.currentTime/video.duration * 100}%`
            spend[index] = video.currentTime
        }, 30)
    }
    calcProgress();

    // 监听视频结束
    video.addEventListener('ended', function () {
        console.log('视频结束');
        index += 1;
        console.log(index);
        videoPlay();
    })
    //暂停
    stopBtn.addEventListener('click', function () {
        cover.style.display = 'block';
        video.pause();
        curImg.src = `${BASE_URL}${fragments[index].imgUrl}`
        window.clearInterval(ntervalId);
    })

    //继续
    continueBtn.addEventListener('click', function () {
        cover.style.display = 'none';
        video.play();
        calcProgress();
    })

    //上一节
    preBtn.addEventListener('click', function () {
        if (index === 0) {
            return
        }
        index -= 1;
        videoPlay();
    })

    //下一节
    nextBtn.addEventListener('click', function () {
        if (index === fragments.length - 1) {
            return
        }
        index += 1;
        videoPlay();
    })



    // 结束

    overBtn.addEventListener('click', function () {
        let totle = 0;
        console.log(spend);
        spend.forEach(function (item) {
            totle += item
        })
        console.log(totle);
        let params = {
            "id": location.search.split('=')[1],
            "userId": JSON.parse(localStorage.getItem('user')).userId,
            "takeTime": totle,
            "calorie": totle * 1.3
        }
        //发送请求保存数据
        $http.post('/sports/saveTrain',params, function (res) {
            if (res.status === 0) {
                console.log(res);
                console.log('发送成功');
                location.href='./sports-course.html'
            }
        })

    })

})